<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--DP = Depósitos y Pagos-->

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>

	<link type="text/css" rel="Stylesheet"
		href="../../css/jquery-ui-1.8.20.custom.css" />

	<link type="text/css" rel="Stylesheet"
		href="../../css/style_coopac.css" />
		
	<h:outputScript library="primefaces" name="jquery/jquery.js" /> 
	<script type="text/javascript" src="../../js/jquery.maskedinput-1.3.js" ></script><!-- solo numeros  -->
	<script type="text/javascript" src="../../js/jquery.alphanumeric.js" ></script><!--  -->
	<script type="text/javascript" src="../../js/custom.js" ></script> 	

</h:head>

<h:body>
	<div id="contenedor">
		<div id="headerCaja"></div>

		<div id="menu">
			<ui:include src="../00_genericos/menu.xhtml"></ui:include>
		</div>

		<div id="formularios">
			<h:form id="form" prependId="true">
				<div id="cuerpo">
					<p:panel header="Depósitos y Pagos" style="font-size:20px; height:50px;">
					</p:panel>
					<p:panel header="Buscar Operación:" toggleable="true" >

						<div class="rowForm">
							
							<div class="label">
								<label>Código Oper.:</label>
							</div>
							<div class="field">
								<p:inputText />
							</div>
							<div class="buttonSearch">
								<p:commandButton icon="ui-icon-search"
											onclick="popupcheck.show();">
								</p:commandButton>
							</div>
							<div class="buttonSearch">
								<p:commandButton icon="ui-icon-refresh"  styleClass="clear">		
								</p:commandButton>
							</div>
							<p:dialog id="popupcheck" header="Visto Bueno"
								showEffect="drop" hideEffect="drop" draggable="false" 
								resizable="false" modal="true" widgetVar="popupcheck">
								<p:panel>
									<div class="rowForm">
										<label>Password:</label>
										<p:spacer width="50" height="10"/>
										<p:password></p:password>
										<p:spacer width="50" height="10"/>
										<p:commandButton icon="ui-icon-check"/>
									</div>
								</p:panel>
							</p:dialog>
						</div>
					</p:panel>
					<p:panel header="Información del Titular" toggleable="true" >

						<div class="rowForm">
							<div class="label">
								<label>Buscar por.:</label>
							</div>
							<div class="select">
								<p:selectOneMenu style="width:160px">
									<f:selectItem itemLabel="Seleccione Criterio" itemValue="1" />
									<f:selectItem itemLabel="Documento" itemValue="2" />
								</p:selectOneMenu>
							</div>
							<div class="label">
								<label>Criterio:</label>
							</div>
							<div class="field">
								<p:inputText value="#{fichaSocioP.numdocumentoPersonaN}" style="width:157px" styleClass="buscarxdni" />
							</div>
							<div class="buttonSearch">
								<p:commandButton actionListener="#{fichaSocioP.buscarByNumDocumento}" 
								  update=":form:personaN"	icon="ui-icon-search"  id="boton">
								</p:commandButton>
							</div>
							<div class="buttonSearch">
								<p:commandButton icon="ui-icon-refresh"  styleClass="clear">
								</p:commandButton>
							</div>
						</div>
					</p:panel>
					
					<p:panel header="Información del Depositante" id="personaN" toggleable="true">
						<div class="rowForm">
							<div class="label">
								<label for="namevv">Tipo Doc.:</label>
							</div>
							<div class="select">
								<p:selectOneMenu 
									disabled="true" 
									value="#{fichaSocioP.tipoDocumentoN.idTipoMaestro}"
									style="width:160px">
									<f:selectItem itemLabel="Tipo Documento" />
									<f:selectItems value="#{maestro.listaTipodocumento}" />
								</p:selectOneMenu>
							</div>
							<div class="label">
								<label for="namevv">Número:</label>
							</div>
							<div class="field">
								<p:inputText
									style="width:157px" />
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Ape.Paterno:</label>
							</div>
							<div class="field">
								<p:inputText
									disabled="true"
									value="#{fichaSocioP.personaN.apellidoPaternoRazonSocial}"
									style="width:453px" styleClass="apePatN" />
							</div>
						</div>
						<div class="rowForm">
							<div class="label">
								<label>Ape.Materno:</label>
							</div>
							<div class="field">
								<p:inputText 
									disabled="true"
									value="#{fichaSocioP.personaN.apellidoMaterno}"
									style="width:453px" styleClass="apePatN" />
							</div>
						</div>
						<div class="rowForm">
							<div class="label">
								<label>Nombres:</label>
							</div>
							<div class="field">
								<p:inputText
									disabled="true"
									value="#{fichaSocioP.personaN.nombrePersonaNombreComercial}"
									style="width:453px" styleClass="nomN" />
							</div>
						</div>
					</p:panel>
					
					<p:panel header="Información del Depositante" toggleable="true" id="depositante">
						<div class="rowForm">
							<div class="label">
								<label for="namevv">Tipo Doc.:</label>
							</div>
							<div class="select">
								<p:selectOneMenu
									style="width:160px">
									<f:selectItem itemLabel="Tipo Documento" />
									<f:selectItems value="#{maestro.listaTipodocumento}" />
								</p:selectOneMenu>
							</div>
							<div class="label">
								<label for="namevv">Número:</label>
							</div>
							<div class="field">
								<p:inputText
									style="width:157px" />
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Es Titular" actionListener="#{fichaSocioP.buscarByNumDocumento}" 
								  	update=":form:depositante"  id="boton1"/>
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Ape.Paterno:</label>
							</div>
							<div class="field">
								<p:inputText
									value="#{fichaSocioP.personaN.apellidoPaternoRazonSocial}"
									style="width:453px" styleClass="apePatN" />
							</div>
						</div>
						<div class="rowForm">
							<div class="label">
								<label>Ape.Materno:</label>
							</div>
							<div class="field">
								<p:inputText
									value="#{fichaSocioP.personaN.apellidoMaterno}"
									style="width:453px" styleClass="apePatN" />
							</div>
						</div>
						<div class="rowForm">
							<div class="label">
								<label>Nombres:</label>
							</div>
							<div class="field">
								<p:inputText
									value="#{fichaSocioP.personaN.nombrePersonaNombreComercial}"
									style="width:453px" styleClass="nomN" />
							</div>
						</div>
					</p:panel>

					<p:panel header="Tipo de Depósito" toggleable="false">
						<hr></hr>
							<div class="rowForm">
								<div class="label">
									<label>Tipo de Depós.:</label>
								</div>
								<div class="select">
									<p:selectOneMenu  style="width:453px" value="#{depositoPago.tipoDP}">
										<f:selectItem itemLabel="Seleccione Tipo de Depósito"/>
										<f:selectItem itemLabel="Amortización o Liquidación de Préstamos" itemValue="1"/>
										<f:selectItem itemLabel="Cuenta Aportaciones y Fondo Mortuorio" itemValue="2"/>
										<f:selectItem itemLabel="Cuentas Corrientes" itemValue="3"/>
										<f:selectItem itemLabel="Cuentas de Ahorros" itemValue="4"/>
									</p:selectOneMenu>
								</div>
								<div class="label">
									<div class="buttonProcess">
										<p:commandButton value="Habilitar" actionListener="#{depositoPago.openTDP}"
										update=":form:alp,:form:afm,:form:cc,:form:ca"/>
									</div>
								</div>
							</div>
						<hr></hr>
					</p:panel>
					
					<p:panel header="Amortización o Liquidación de Préstamos" id="alp" visible="#{depositoPago.openALP}" >
						<div class="rowForm">
							<div class="label">
								<label>Préstamos:</label>
							</div>
							<div class="field">
								<p:inputText style="width:157px"/>
							</div>
							<div class="buttonSearch">
								<p:commandButton icon="ui-icon-search">
								</p:commandButton>
							</div>
							<div class="buttonSearch">
								<p:commandButton icon="ui-icon-refresh">
								</p:commandButton>
							</div>
						</div>
						<div class="rowForm">
							<p:dataTable>

								<p:column headerText="Código">
								</p:column>
								<p:column headerText="Tipo de Crédito">
								</p:column>
								<p:column headerText="Divisa">
								</p:column>
								<p:column headerText="Monto">
								</p:column>
								<p:column headerText="Saldo Deudor">
								</p:column>
								<p:column headerText="Estado">
								</p:column>
								<p:column headerText="Ver">
								</p:column>

							</p:dataTable>
						</div>
						<br></br>
						<br></br>
						<br></br>
						<br></br>
						
						<div class="rowForm">
							<p:dataTable>

								<p:column headerText="Nro. Letra">
								</p:column>
								<p:column headerText="Fech. Venc.">
								</p:column>
								<p:column headerText="Cuota">
								</p:column>
								<p:column headerText="Saldo Deudor">
								</p:column>
								<p:column headerText="Estado">
								</p:column>
								<p:column headerText="Pagar">
								</p:column>

							</p:dataTable>
						</div>
						<br></br>
						<br></br>
						<br></br>
						<br></br>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto a Pagar:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Pagar Todas las Cuotas" />
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Confirmar Monto:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Limpiar" />
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto en Letras:</label>
							</div>
							<div class="field">
								<p:inputText disabled="true" style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<label>Pago por Planilla</label>
							</div>
							<p:selectBooleanCheckbox></p:selectBooleanCheckbox>
						</div>
						
						<div class="rowForm">
							<div class="buttonProcess">
								<p:commandButton value="Procesar Depósito" 
									onclick="popupcheck1.show();"/>
							</div>
						</div>
						
						<p:dialog id="popupcheck1" header="Confirmar Transacción"
								showEffect="drop" hideEffect="drop" draggable="false" 
								resizable="false" modal="true" widgetVar="popupcheck1">
							<p:panel>
								<div class="rowForm">
									<div class="buttonProcess">
										<p:commandButton value="Procesar Depósito"/>
									</div>
								</div>
							</p:panel>
						</p:dialog>
					</p:panel>
					
					<p:panel header="Cuenta de Aportaciones y Fondo Mortuorio" id="afm" visible="#{depositoPago.openAFM}">
						<div class="rowForm">
							<p:dataTable>

								<p:column headerText="Código">
								</p:column>
								<p:column headerText="Tipo de Cuenta">
								</p:column>
								<p:column headerText="Fech. Apertura">
								</p:column>
								<p:column headerText="Monto Aportado">
								</p:column>
								<p:column headerText="Estado">
								</p:column>
								<p:column headerText="Ver">
								</p:column>

							</p:dataTable>
						</div>
						<br></br>
						<br></br>
						<br></br>
						<br></br>
						
						<div class="rowForm">
							<p:dataTable>

								<p:column selectionMode="single" style="width:18px" />						
								<p:column headerText="Periodo">
								</p:column>
								<p:column headerText="Monto Aportado">
								</p:column>
								<p:column headerText="Estado">
								</p:column>
								<p:column headerText="Pagar">
								</p:column>
								
							</p:dataTable>
						</div>
						<br></br>
						<br></br>
						<br></br>
						<br></br>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto a Pagar:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Pagar Todas las Cuotas" />
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Confirmar Monto:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Limpiar" />
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto en Letras:</label>
							</div>
							<div class="field">
								<p:inputText disabled="true" style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<label>Pago por Planilla</label>
							</div>
							<p:selectBooleanCheckbox></p:selectBooleanCheckbox>
						</div>
						
						<div class="rowForm">
							<div class="buttonProcess">
								<p:commandButton value="Procesar Depósito" 
									onclick="popupcheck2.show();"/>
							</div>
						</div>
						<p:dialog id="popupcheck2" header="Confirmar Transacción"
								showEffect="drop" hideEffect="drop" draggable="false" 
								resizable="false" modal="true" widgetVar="popupcheck2">
							<p:panel>
								<div class="rowForm">
									<div class="buttonProcess">
										<p:commandButton value="Procesar Depósito"/>
									</div>
								</div>
							</p:panel>
						</p:dialog>
					</p:panel>
					
					<p:panel header="Cuentas Corrientes" id="cc" visible="#{depositoPago.openCC}">
						<h2>Información del Depósito:</h2>						
						<div class="rowForm">
							<div class="label">
								<label>Selecc. Cuenta:</label>
							</div>
							<div class="select">
								<p:selectOneMenu style="width:453px">
									<f:selectItem itemLabel="Seleccione Cuenta" />
									<f:selectItem itemLabel="JovenCOOP" />
									<f:selectItem itemLabel="MadreCOOP" />
								</p:selectOneMenu>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto de Depos.:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Confirmar Monto:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto en Letras:</label>
							</div>
							<div class="field">
								<p:inputText disabled="true" style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Limpiar" />
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="buttonProcess">
								<p:commandButton value="Procesar Depósito" 
									onclick="popupcheck3.show();"/>
							</div>
						</div>
						<p:dialog id="popupcheck3" header="Confirmar Transacción"
								showEffect="drop" hideEffect="drop" draggable="false" 
								resizable="false" modal="true" widgetVar="popupcheck3">
							<p:panel>
								<div class="rowForm">
									<div class="buttonProcess">
										<p:commandButton value="Procesar Depósito"/>
									</div>
								</div>
							</p:panel>
						</p:dialog>
					</p:panel>
					
					<p:panel header="Cuentas de Ahorro" id="ca" visible="#{depositoPago.openCA}">
						<div class="rowForm">
							<p:dataTable>

								<p:column selectionMode="single" style="width:18px" />
								<p:column headerText="Código">
								</p:column>
								<p:column headerText="Tipo de Cuenta">
								</p:column>
								<p:column headerText="Fech. Apertura">
								</p:column>
								<p:column headerText="Monto Ahorrado">
								</p:column>
								<p:column headerText="Divisa">
								</p:column>
								<p:column headerText="Estado">
								</p:column>
								<p:column headerText="Ver">
								</p:column>


							</p:dataTable>
						</div>
						<br></br>
						<br></br>
						<br></br>
						<br></br>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto de Depos.:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Confirmar Monto:</label>
							</div>
							<div class="field">
								<p:inputText style="width:453px"></p:inputText>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="label">
								<label>Monto en Letras:</label>
							</div>
							<div class="field">
								<p:inputText disabled="true" style="width:453px"></p:inputText>
							</div>
							<div class="label">
								<div class="buttonProcess">
									<p:commandButton value="Limpiar" />
								</div>
							</div>
						</div>
						
						<div class="rowForm">
							<div class="buttonProcess">
								<p:commandButton value="Procesar Depósito" 
									onclick="popupcheck4.show();" />
							</div>
						</div>
						<p:dialog id="popupcheck4" header="Confirmar Transacción"
								showEffect="drop" hideEffect="drop" draggable="false" 
								resizable="false" modal="true" widgetVar="popupcheck4">
							<p:panel>
								<div class="rowForm">
									<div class="buttonProcess">
										<p:commandButton value="Procesar Depósito"/>
									</div>
								</div>
							</p:panel>
						</p:dialog>
					</p:panel>
					
				</div>
			</h:form>
		</div>

		<div id="footerCaja"></div>

	</div>
</h:body>

</html>